<template>
      <div>
        <ul>
          <li class="list" v-for="(item) in enterinfo" v-bind:key="item" @click="eninfo(item.wid,item.tid,item.enterInfo.uid)">
            <div class="sub-li" style="position:relative;">
              <a href="#" class="job-info" style="text-decoration:none">
                <div class="sub-li-top" style="margin-top: 0px">
                  <p class="gname">{{item.enterInfo.cname}}</p>
                  <p class="salary">{{item.salary}}</p>
                </div>
                <p class="job-text">{{item.address.province}}<span class="vline">
                  </span>{{item.exp}}<span class="vline">
                    </span>{{item.xli}}</p>
              </a>
              <div class="sub-li-bottom">
                <a href="#" class="user-info" style="text-decoration:none">
                  <p><img :src="qz+item.enterInfo.logoimg"></p>
                </a>
                <a href="#" style="margin-left: 28px;font-size: 14px;color: #8c939d;margin-top: 8px">
                  <span >{{item.gname}}</span>
                  <span class="vline">
                    </span>
                  <span >{{item.gw}}</span>
                </a>
              </div>
            </div>
          </li>
        </ul>
      </div>
</template>
<script>
export default {
  name: "CoolectSpace",
  data(){
    return{
      qz:this.$axios.defaults.baseURL,
      enterinfo:[],
    };
  },
  methods:{
    eninfo(wid,tid,uid){
      console.log(uid)
      sessionStorage.setItem("tuid",uid)
      this.$router.push({path: '/enterinfo', query: {wid: wid,tid:tid,type:"collect"}})
    }
  },
  mounted() {
    this.$axios({
      url: this.$axios.defaults.baseURL+"/student/favorite",
      method: "post",
      params:{
        uid:sessionStorage.getItem("studentuid")
      }
    }).then(res => {
      console.log(res.data);
      this.enterinfo = res.data;
    })
  }
}

</script>

<style scoped>
.vline {
  display:inline-block;
  width:1px;
  height:12px;
  vertical-align:middle;
  background:#8c939d;
  margin:0 10px
}
.list{
  list-style-type:none;
  float: left;
  padding-right: 20px;
  padding-top: 20px;
}

.sub-li .sub-li-top {
  width:340px;
  display:flex;
  align-items:center
}
.sub-li .sub-li-top {
  position:relative;
  max-width:200px;
  font-size:15px;
  margin-right:8px;
  line-height:normal;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-top{
  font-size:15px;
  color:#fd7240;
  line-height:normal;
  flex:1;
  text-align:right;
  max-width:none
}

.salary {
  font-size:15px;
  color:#fd7240;
  margin-top: 0px;
  padding-left: 17%;
}

.gname {
  font-size:15px;
  color:black;
  margin-top: 0px;
  margin-left:0px;
}
.sub-li a.job-info {
  padding:0;
  width:340px;
}
.sub-li-bottom a.user-info {
  margin:0
}
.sub-li-bottom .user-info img {
  width:30px;
  height:30px
}
.job-text{
  font-size: 14px;
  color: #8c939d;
}
.sub-li .sub-li-bottom {
  border-top:1px solid #eef0f5;
  display:flex;
  margin-top:8px;
  padding-top:12px
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info {
  font-size:13px;
  color:#8d92a1;
  display:flex;
  align-items:center;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info .name {
  margin-left:10px;
  margin-right:20px;
  max-width:140px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info .type {
  max-width:90px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li .sub-li-bottom .sub-li-bottom-commany-info{
  max-width:80px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap
}
.sub-li {
  width:340px;
  height:100%;
  position:relative;
  padding:20px 20px 0 20px;
  box-sizing:border-box;
  border-radius:5px;
  background-color: white;
}

</style>